<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="UTF-8">
	<title>红酒会 - 智能红酒管家</title>
	<link rel="shortcut icon" type="image/x-icon" href="${ctx}/favicon.ico" />
	<link type="text/css" rel="stylesheet" href="${ctx}/static/styles/bootstrap.min.css" />
</head>
<body>
	
	<c:import url="/header"><c:param name="module">vintry</c:param></c:import>
	<c:import url="/vintry/menu"><c:param name="menu">1</c:param></c:import>
	<c:import url="/talk/right" />
	
	<div class="outWrap">
		<div class="spekBoxIn entde">

			<c:if test="${not empty errorMsg}">
				<div class="alert alert-error">
					<button type="button" class="close" data-dismiss="alert">&times;</button>
  					<strong>错误信息：</strong>
  					${errorMsg}
				</div>
			</c:if>
			<div id="error_msg" class="alert alert-error" style="display:none">
				<button type="button" class="close" data-dismiss="alert">&times;</button>
				<strong>错误信息：</strong>
				酒名（中文）或酒名（英文）必需填写一项
			</div>
			<div style="text-align:center;padding-bottom:5px;"><div id="error_msg" class="red"></div></div>
<form id="form" action="${ctx}/vintry/create" enctype="multipart/form-data" method="post" class="form-horizontal">
	<div class="detailTit">公共信息</div>
	<div class="detailTbbox">
       	<div class="control-group">
			<label class="control-label" for="chName">酒名（中文）</label>
			<div class="controls">
				<input type="text" id="chName" name="wine.chName" class="input-xlarge"
					value="${vintry.wine.chName}" placeholder="中外文至少填写一项" />
				<span id="error_chName" class="red"></span>
			</div>
		</div>
		<div class="control-group">
			<label class="control-label" for="enName">酒名（外文）</label>
			<div class="controls">
				<input type="text" id="enName" name="wine.enName" class="input-xlarge"
					value="${vintry.wine.enName}" placeholder="中外文至少填写一项" />
				<span id="error_enName" class="red"></span>
			</div>
		</div>
		<div class="control-group">
			<label class="control-label" for="capacity">容量</label>
			<div class="controls">
				<div class="input-append">
					<select name="wine.capacity" class="input-small">
						<c:forEach var="capacity" items="${capacityList}">
							<option value="${capacity.name}"
								${capacity.name==wine.capacity?'selected':''}>${capacity.name}</option>
						</c:forEach>
					</select>
				<span class="add-on">ml</span>
			</div>
			</div>
		</div>
		<div class="control-group">
			<label class="control-label" for="vintage">年份</label>
			<div class="controls">
				<div class="input-prepend input-append">
	  				<input type="text" id="vintage" name="wine.vintage" class="input-mini"
	  					value="${vintry.wine.vintage}" placeholder="2000" />
	  				<span class="add-on">年</span>
				</div>
				<span id="error_vintage" class="red"></span>
			</div>
		</div>
		<div class="control-group">
			<label class="control-label" for="wineTypeId">分类</label>
			<div class="controls">
				<select name="wine.type.id">
					<c:forEach var="type" items="${typeList}">
						<option value="${type.id}"
							${type.id==wine.type.id?'selected':''}>${type.name}</option>
					</c:forEach>
				</select>
			</div>
	  	</div>
		<div id="group_pic" class="control-group">
			<label class="control-label" for="pic">图片</label>
			<div class="controls">
				<div class="input-append">
					<input type="file" id="pic" name="pic" style="display:none" onchange="upfile.value=this.value">
					<input type="text" id="upfile" name="upfile" onclick="pic.click();" readonly="readonly">
	  				<a href="javascript:;" class="btn" onclick="pic.click();">选择</a>
				</div>
				<span class="help-inline">请上传图片小于1MB的JPG、PNG格式图片</span>
			</div>
		</div>
		<div class="control-group">
			<label class="control-label" for="barcode">条形码</label>
			<div class="controls">
				<input type="text" id="barcode" name="wine.barcode" value="${vintry.wine.barcode}">
				<span id="error_barcode" class="red"></span>
			</div>
		</div>
		<div class="control-group">
			<label class="control-label" for="countryId">国家</label>
			<div class="controls">
				<select id="countryId" name="wine.country.id">
					<c:forEach var="countryList" items="${countryList}">
						<option value="${countryList.id}"
							${countryList.id==vintry.wine.country.id?'selected':''}>${countryList.name}</option>
					</c:forEach>
				</select>
			</div>
		</div>
		<div class="control-group">
			<label class="control-label" for="region">产区</label>
			<div class="controls">
				<input type="text" id="region" name="wine.region" placeholder="波尔多 波雅克" value="${vintry.wine.region}">
				<span id="error_region" class="red"></span>
			</div>
		</div>
		<div class="control-group">
			<label class="control-label" for="grade">级别</label>
			<div class="controls">
				<input type="text" id="grade" name="wine.grade" placeholder="AOC" value="${vintry.wine.grade}">
				<span id="error_grade" class="red"></span>
			</div>
		</div>
		<div class="control-group">
			<label class="control-label" for="variety">葡萄品种</label>
			<div class="controls">
				<input type="text" id="variety" name="wine.variety" class="input-xlarge"
					placeholder="赤霞珠、美乐、品丽珠、小维泽" value="${vintry.wine.variety}">
				<span class="help-inline">如有多个，请用英文半角顿号（、）分割</span>
				<div id="error_variety" class="red"></div>
			</div>
		</div>
		<div class="control-group">
			<label class="control-label" for="alcoho">酒精含量</label>
			<div class="controls">
				<div class="input-append">
	  				<input type="text" id="alcoho" name="wine.alcoho" class="input-mini" value="${vintry.wine.alcoho}" />
	  				<span class="add-on">°</span>
				</div>
				<span id="error_alcoho" class="red"></span>
			</div>
		</div>
	</div>
	<div class="detailTit">用户信息</div>
	<div class="detailTbbox">
		<div class="control-group">
			<label class="control-label" for="price">购买价格</label>
			<div class="controls">
				<div class="input-append">
	  				<input type="text" id="price" name="price" class="input-mini" 
	  					value="<fmt:formatNumber value="${vintry.price}" pattern="#0.##"/>" />
	  				<span class="add-on">元</span>
				</div>
				<span id="error_price" class="red"></span>
			</div>
		</div>
		<div class="control-group">
			<label class="control-label" for="marketPrice">市场价格</label>
			<div class="controls">
				<div class="input-append">
	  				<input type="text" id="marketPrice" name="marketPrice" class="input-mini"
	  					value="<fmt:formatNumber value="${vintry.marketPrice}" pattern="#0.##"/>"/>
	  				<span class="add-on">元</span>
				</div>
				<span id="error_marketPrice" class="red"></span>
			</div>
		</div>
		<div class="control-group">
			<label class="control-label" for="drinkingRange">适饮期</label>
			<div class="controls">
				<div class="input-append">
	  				<input type="text" id="drinkingRange" name="drinkingRange"
	  					value="${vintry.drinkingRange}" class="input-mini" />
	  				<span class="add-on">年</span>
				</div>
				<span id="error_drinkingRange" class="red"></span>
			</div>
		</div>
		<div class="control-group">
			<label class="control-label" for="remark">备注</label>
			<div class="controls">
				<textarea id="remark" name="remark" rows="3" class="input-xlarge">${vintry.remark}</textarea>
				<div id="error_remark" class="red"></div>
			</div>
		</div>
	
		<div class="control-group">
	    	<div class="controls">
	      		<button type="submit" class="btn btn-info">&nbsp;&nbsp;&nbsp;提&nbsp;&nbsp;&nbsp;交&nbsp;&nbsp;&nbsp;</button>
	    	</div>
	  	</div>
	</div>
</form>

		</div>
	</div>
	

	<c:import url="/WEB-INF/views/footer.jsp" />

	<script type="text/javascript" src="${ctx}/static/scripts/jquery.validate.min.js"></script>
	<script type="text/javascript">
		$(function() {
			$('#form').validate({
				rules: {
					'wine.chName': {
						maxlength: 50
					},
					'wine.enName': {
						maxlength: 50
					},
					'wine.vintage': {
						required: true,
						range: [1600, new Date().getFullYear()]
					},
					'wine.barcode': {
						number: true,
						maxlength: 30
					},
					'wine.region': {
						maxlength: 15
					},
					'wine.grade': {
						maxlength: 10
					},
					'wine.variety': {
						maxlength: 50,
					},
					'wine.alcoho': {
						digits:true,
						range: [5, 60]
					},
					price: {
						number: true,
						max: 10000000
					},
					marketPrice: {
						number: true,
						max: 10000000
					},
					drinkingRange: {
						required: true,
						digits: true,
						max: 1000
					},
					remark: {
						maxlength: 100
					}
				},
				messages: {
					'wine.chName': {
						maxlength: '中文名称不能超过50个字符'
					},
					'wine.enName': {
						maxlength: '英文名称不能超过50个字符'
					},
					'wine.vintage': {
						required: '请填写年份',
						range: '年份应该在{0}到{1}之间'
					},
					'wine.barcode': {
						number: '条形码只能填写数字',
						maxlength: '条形码长度不能超过{0}位'
					},
					'wine.region': {
						maxlength: '产区不能超过{0}个字符'
					},
					'wine.grade': {
						maxlength: '级别不能超过{0}个字符'
					},
					'wine.variety': {
						maxlength: '葡萄品种不能超过{0}个字符',
					},
					'wine.alcoho': {
						digits: '酒精含量只能填写整数',
						range: '酒精含量应在{0}°到{1}°之间'
					},
					price: {
						number: '购买价格只能填写数字',
						max: '购买价格不能超过{0}元'
					},
					marketPrice: {
						number: '市场价格只能填写数字',
						max: '市场价格不能超过{0}元'
					},
					drinkingRange: {
						required: '请填写适饮期',
						digits: '适饮期只能填写整数',
						max: '适饮期不能超过{0}年'
					},
					remark: {
						maxlength: '备注不能超过{0}个字符'
					}
				},
				errorElement: 'em',
				errorPlacement: function(error, element) {
					error.appendTo($("#error_" + element.attr("id")));
				},
				submitHandler: function(form) {
					if($('#chName').val()=='' && $('#enName').val()=='') {
						$('#error_msg').show();
						window.scrollTo(0,0);
					}else {
						$('#error_msg').hide();
						form.submit();	
					}
				}
			});
		});
	</script>
</body>
</html>